在之前的文章介紹了變數的宣告以及有效範圍,接下來我們來聊聊變數更新與傳遞吧!但在這之前我們先來簡單複習一下基本型別與物件型別。
基本型別與物件的比較
var a = 5;
var b = 5;
var c = "bob";
var d = "bob";
console.log(a === b); //true
console.log(a === c); //false
console.log(c === d ); // true
相信現在大家現在看基本型別的比較,應該是沒有太大的問題。當我們判斷變數是否相等的時候,是比較兩變數的內容,也就是「值」。
那物件呢?直接來看範例:
var obj1 = {name: "will"};
var obj2 = {name: "will"};
console.log(obj1 === obj2); //false
為什麼會是false呢?這是因爲在物件的情況下,我們應該把它看作是一個實體。以上面的範例來想像一下,有兩個名子都叫做will的,但他們其實是兩個不同的人,只是名子剛好一樣而已。
接下來我們就來看看基本型別與物件的變數更新與傳遞
基本型別的更新與傳遞
直接來看看範例:
var a = 5;
var b = a;
console.log(a); //5
console.log(b); //5
在上面的範例中,先宣告變數a並指派5,然後我們在宣告變數b並指派a給它,印出a、b都印出5。前面我們有提到說基本型別的變數,我們是看裡面的「值」。在這裡b的值是透過複製a的值而來的。
再進一步來看,那改變a會不會連動影響b?
var a = 5;
var b = a;
console.log(a); //5
console.log(b); //5
a = 150;
console.log(a); //150
console.log(b); //5
從結果來看是不影響的,也再次證明「b的值是透過複製a的值」,所以,a和b是獨立的,當a內容後來被更改,也不會影響b。這情況我們稱為「傳值」(pass by value)。
物件型別的更新與傳遞
一樣讓我們直接來看範例:
var obj1 = {value: 10};
var obj2 = obj1;
console.log(obj1.value); //10
console.log(obj2.value); //10
目前看起來跟基本型別差不多,那如果改變obj1的value會影響obj2嗎?
var obj1 = {value: 10};
var obj2 = obj1;
console.log(obj1.value); //10
console.log(obj2.value); //10
obj1.value = 150;
console.log(obj1.value); //150
console.log(obj2.value); //150
console.log(obj1 === obj2); //true
從上面範例可發現obj2跟著改變了,而且obj1與obj2是同ㄧ個實體。所以說物件並不是以傳值的方式來傳遞資料,那它是怎麼傳遞資料呢?它其實是透過「引用」的方式傳遞資料。 可以想像一開始obj1宣告之後放在記憶體某個位置,然後當我們指派給obj2的時候,是將這個位置告訴obj2,所以當我們改變obj1的時候會會連動改變obj2,因為obj其實是指向obj1,這也是為什麼兩個變數會相等。這樣的傳遞方式稱作「傳址」(pass by reference)。
所以JavaScript變數傳遞是「傳值」與「傳址」嗎?讓我們明天再揭曉了!大家明天見!